<template>
	<view>
		<view v-if="inPorcessOrderId != null" class="order-process" @click="toOrder">您有进行中的订单,点击查看</view>
		
		<map id="map" :longitude="from.longitude" :latitude="from.latitude" :style="contentStyle" scale="15" :enable-traffic="false" :show-location="true" :enable-poi="true" class="map">
			<cover-image class="location" src="../../static/workbench/location.png" @tap="toLocationHandle()"></cover-image>
		</map>
		<view class="panel">
			<view class="from" @tap="chooseLocationHandle('from')">
				<text>{{ from.address }}</text>
			</view>
			<view class="dashed-line"></view>
			<view class="to" @tap="chooseLocationHandle('to')">
				<text>{{ to.address }}</text>
			</view>
			<button class="btn" @tap="toCreateOrderHandle">查看路线</button>
		</view>
	</view>
</template>

<script>
	
import GtPush from '../../lib/gtpush-min.js'
	//地图点选插件
const chooseLocation = requirePlugin('chooseLocation');
let QQMapWX = require('../../lib/qqmap-wx-jssdk.min.js');
let qqmapsdk ;

export default {
	data() {
		return {
			//开始位置
			from: {
				address: '输入你的开始位置',
				longitude: 0,
				latitude: 0
			},
			//结束位置
			to: {
				address: '输入你的目的地', 
				longitude: 0,
				latitude: 0
			},
			
			//窗口样式
			contentStyle: '',
			windowHeight: 0,
			//地图对象
			map: null,
			//标记:开始位置点选或者结束位置点选
			chooseFromOrToflag: null,
			inPorcessOrderId:null,
			chooseType:"",
		};
	},
	methods: {
		// 判断当前乘客是否有订单运行
		checkRunningOrder(){
		  let _this = this;
		  _this.get("/order/manager/order/checkRunningOrder",res=>{
			if(res.data.success){
			  console.log(res)
			  uni.setStorageSync("from",res.data.data.from);
			  uni.setStorageSync("to",res.data.data.to);
			  uni.navigateTo({
				url:"/pages/create_order/create_order"
			  })
			}
		  })
		},
		// 初始化key
		initWecathKey(){
			qqmapsdk = new QQMapWX({
			    key:this.Consts.QQMAP_KEY // 必填
			});
		},
		//获取当前位置坐标
		getLocation(){
		  var _this = this;
		  uni.getLocation({
			type: 'gcj02',
			success: function (res) {
				// 纬度
			  _this.from.latitude = res.latitude;
			   //经度
			  _this.from.longitude = res.longitude
			  //当前位置信息
			  _this.getCutyPosition(res.latitude,res.longitude);
			}
		  });
		},
		//初始化窗口样式
		initStyle(){
		  let _this = this;
		  //处理窗口样式
		  let windowHeight = uni.getSystemInfoSync().windowHeight;
		  _this.windowHeight = windowHeight;
		  _this.contentStyle = `height:${_this.windowHeight}px;`;
		},
		// 点击图标回到当前位置
		toLocationHandle(){
			var _this = this;
			// 重新回去自己位置，防止中途变了
			_this.getLocation();
			var map = uni.createMapContext("map",_this);
			//moveToLocation将地图中心移动到当前定位点，需要配合map组件的show-location使用
			map.moveToLocation({
				longitude:_this.from.longitude,
				latitude:_this.from.latitude
			})
		},
		// 转换位置为城市位置
		getCutyPosition(latitude,longitude){
		  var _this = this
		  qqmapsdk.reverseGeocoder({
			location:{
			  latitude: latitude,
			  longitude: longitude
			},
			success: function(res) {//成功后的回调
			  if(res.message =="Success"){
				  _this.from.address = res.result.formatted_addresses.standard_address
			  }
			  
			},
			// 失败返回
			fail: function(error) {
			  console.error(error);
			},
		  })
		},
		//腾讯位置选点
		chooseLocationHandle(type){
			this.chooseType = type;
			const key = this.Consts.QQMAP_KEY; //使用在腾讯位置服务申请的key
			const referer = 'flyingcar'; //调用插件的app的名称	
			wx.navigateTo({
			  url: `plugin://chooseLocation/index?key=${key}&referer=${referer}`,
			});
		},
		// 腾讯地图选点位置返回
		finalStartingPointPosition(location){
			var _this = this;
			if(!(_this.chooseType || location)){
				return;
			}
			if(_this.chooseType == 'from'){
				_this.from.address = location.address,
				_this.from.latitude = location.latitude,
				_this.from.longitude = location.longitude
			}else{
				_this.to.address = location.address,
				_this.to.latitude = location.latitude,
				_this.to.longitude = location.longitude
			}
		},
		accpetLocationChange(){
		  let _this = this;
		  //拿到小程序的坐标，实时传输过来的
		  uni.$on("locationChange",(location)=>{
			_this.from.latitude = location.latitude;
			_this.from.longitude = location.longitude;
		  })
		},
		// 查询路线
		toCreateOrderHandle(){
			// 将坐标存入storage
			uni.setStorageSync("from",this.from);
			uni.setStorageSync("to",this.to);
			uni.navigateTo({
				url:"/pages/create_order/create_order"
			})
		},
	},
	onShow: function() {
		var _this = this;
		_this.accpetLocationChange();
		//腾讯位置选点返回结果
		const location = chooseLocation.getLocation(); 
		_this.finalStartingPointPosition(location);
		
	},
	onHide: function() {
	},
	onLoad: function() {
		let _this = this;
		_this.initWecathKey();
		_this.getLocation();
		_this.initStyle();
		_this.checkRunningOrder();
	
	},
	onUnload: function() {
		
	}
};
</script>

<style lang="less">
@import url('workbench.less');
</style>
